<template>
  <div class="home">
    <!-- <img alt="Vue logo" src="../assets/logo.png"> -->
    <!-- <HelloWorld msg="Welcome to Your Vue.js + TypeScript App" /> -->
    <el-date-picker v-model="value1" placeholder="" type="datetimerange" format="YYYY-MM-DD HH:mm:ss"></el-date-picker>
    <MyExample ref="myExample" msg="他妈的惊喜"></MyExample>
    <Example ref="example" msg="他妈的惊喜"></Example>
  </div>
</template>

<script lang="ts">
import { Component, Vue, toNative } from 'vue-facing-decorator'
import dayjs from 'dayjs'
import MyExample, {MyExample as Example} from '@/pages/index/components/MyExample.vue'

@Component({
  components:{
    MyExample,
    Example
  }
})
class Home extends Vue {
  orderCreatedTimeStringArray = new Array<string>(dayjs(new Date(new Date().getTime() - 86400000 * 3)).format('YYYY-MM-DD HH:mm:ss'), dayjs().format('YYYY-MM-DD HH:mm:ss'))
  value1 = [new Date(2000, 10, 10, 10, 10), new Date(2000, 10, 11, 10, 10)]

  mounted() {
    console.log('this.$refs.myExample', this.$refs.myExample,  this.$refs.example , MyExample, Example, this.$refs.example instanceof Example);
  }
}
export default toNative(Home)
</script>
